



import React, { useEffect, useState } from "react"
import { RecordApi } from "../api/api"
import Page from "./Page"  

export default function Parkjl() {

   const [list, setlist] = useState([])

   // 页数
   const [pageNum, setPageNum] = useState(1)
   // 一页显示数量
   const [pageSize, setPageSize] = useState(10)
   // 总页数
   const [pages, setPages] = useState(1)

   async function onChangePage(val: any) {
      record({
         pageNum: val,
         pageSize: 10
      })
      setPageNum(val)
   }

   const record = async (params: any) => {
      // console.log(params);
      const res = await RecordApi(params)
      setlist(res.data.rows)
      setPages(Math.ceil(res.data.total / pageSize))
   }

   useEffect(() => {
      record({ pageNum, pageSize })
   }, [])



   return (
      <div style={{ overflow: 'auto ', height: 'calc(100vh - 100px)' }}>
         <div>
            <div>
               {
                  list.map((item: any, index: any) => {
                     return (
                        <div key={item.id} style={{ textAlign: 'center' }}>
                           <h2 style={{ padding: '10px 10px' }}>
                              {item.parkName}
                           </h2>
                           <div style={{ fontSize: '16px', color: 'red' }} >
                              进去时间：{item.entryTime}
                           </div>
                           <div style={{ fontSize: '16px', color: 'red' }} >
                              出去时间：{item.outTime}
                           </div>
                           <div style={{ fontSize: '16px' }}>
                              {item.plateNumber}
                           </div>
                        </div>
                     )
                  })
               }
            </div>
         </div>
         <Page onChangePage={onChangePage} pagebtnall={pages} pagebtnnum={9} pagecur={pageNum}></Page>
      </div>
   )
}